<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>荣耀商城首页</title>
  <link rel="stylesheet" href="./css/index.css">
  <link rel="stylesheet" href="./css/reset.css">
  <script src="./js/jquery.js"></script>
</head>
<body>
  <!-- 第一栏导航 -->
  <div class="navigationbar">
      <div class="navigation "> 
        <div class="nav-left">
          <ul >
            <li><a href="">荣耀商城</a></li>
            <li><a href="">新闻</a></li>
            <li><a href="">荣耀官网</a></li>
            <li><a href="">会员</a></li>
            <li><a href="">企业购</a></li>
            <li><a href="">荣耀俱乐部</a></li>
          </ul>
        </div>
        <div class="nav-right">
          <ul >
            <li><a href="http://localhost:3000/register.html" class="nrl">注册</a>
              <a href="http://localhost:3000//logon.html">登录</a></li>
            <li><a href="http://localhost:3000/center.html">我的订单</a></li>
            <li class="icon">              
              <a href=""><em></em></a>            
              <a href="http://localhost:3000/shopcar.html">购物车</a>
            </li>
            <li class="icon">
              <a href="">手机端<span></span></a>
              <div class="erweima">
                <div class="ewm1">
                  <div></div>
                  <div class="ewmh icon">
                    <h6>荣耀商城APP</h6>
                    <p>新人专享好礼</p>
                    <p>免费领79元耳机</p>
                    <em></em>
                  </div>
                </div>
                <div class="ewm2">
                  <div class="ewm21"></div>
                  <div class="ewmh icon ewmen">
                    <h6>荣耀商城公众号</h6>
                    <p>微信扫一扫</p>
                    <em></em>
                  </div>
                </div>
                <div class="ewm3">
                  <div></div>
                  <div class="ewmh icon">
                    <h6>微信小程序</h6>
                    <em></em>
                  </div>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </div> 
  </div>
  <!-- 第二栏导航 -->
  <div class="header">
    <div class="header-left">
      <div class="header-left-img">

        </div>
      <ul>
        <li><a href="">荣耀Magic3系列</a></li>
        <li><a href="">荣耀50系列</a></li>
        <li><a href="">数码新品</a></li>
        <li><a href="">荣耀品牌盛典</a></li>
      </ul>
    </div>
    <div class="header-right " >
      <div class="header-right-left" >
        <input   class="input1" type="text" name="" id="txt">
        <ul id="list">

        </ul>
      </div>
      <div class="header-right-right icon">
        <em></em>
      </div>
    </div>

  </div>

  <!-- 导航栏全部完成 -->

<!-- 广告时间 -->
  <div class="banner">
    <div class="banner-backgroun" id="banner_box">
      <img src="./imgs/banner/1.jpg"alt="">
      <img src="./imgs/banner/2.jpg" alt="">
      <img src="./imgs/banner/3.jpg" alt="">
      <img src="./imgs/banner/4.jpg" alt="">
      <img src="./imgs/banner/5.jpg" alt="">
      <img src="./imgs/banner/6.jpg" alt="">
      <img src="./imgs/banner/7.jpg" alt="">
      <img src="./imgs/banner/1.jpg" alt="">
    </div> 
    <div class="bannercent">
      <div class="banner-list">
        <ul>
          <li >
            <a href="http://localhost:3000/goods.html">手机</a>
            <em></em>
            <ul>
              <li>
                <a href="">荣耀magic系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀V系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀 数字系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀 X系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀 play 系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>

            </ul>
          </li>
          <li><a>笔记本</a><em></em>
            <ul>
              <li>
                <a href="">荣耀magicbook v 系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀 magicbook 16 系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀 magicbook 系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀magicbook系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀magicbookPro 系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
              <li>
                <a href="">荣耀猎人笔记本系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
            </ul>
          </li>
          <li>
            <a>平板</a><em></em>
            <ul>
              <li>
                <a href="">荣耀magicbookPro 系列</a>
                <ul>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                  <li>
                    <a href="">hhh</a>
                  </li>
                </ul>
              </li>
            </ul>
          </li>
          <li>
            <a>智能穿戴</a><em></em>
          </li>
          <li>
            <a>智能家居</a><em></em>
          </li>
          <li>
            <a>智慧屏</a><em></em>
          </li>
          <li>
            <a>耳机音箱</a><em></em>
          </li>
          <li>
            <a>配件</a><em></em>
          </li>
          <li><a>生态产品</a><em></em></li>
        </ul>
      </div>  
      <div class="banner-btn">
        <div class="banner-btnleft " id="left"></div>
        <div class="banner-btnright" id="right"></div>
      </div>

      <div class="banner-down">
        <div class="banner-down-a">
          <div class="bd-left">
            <div></div>
            <div>
              <span>您好！请<a href="">&nbsp;登录</a>&nbsp;&nbsp;/&nbsp;&nbsp;<a href="">注册</a></span>
              <br>
            <i><em>新人福利</em></i>
            <i><b>会员频道</b></i>
            </div>
          </div>
          <div class="bd-center ">
            <ul class="flex">
              <li>
                <a href="">
                  <div>
        
                    <img src="./imgs/10.png" alt="">
                  </div>
                </a>
                <a href="">会员领券</a>
              </li>
              <li>
                <a href="">
                  <div>
                    <img src="./imgs/10.png" alt="">
                  </div>
                </a>
                <a href="">智慧生活</a>
              </li>
              <li>
                <a href="">
                  <div>
                    <img src="./imgs/10.png" alt="">
                  </div>
                </a>
                <a href="">Magic3系列</a>
              </li>
              <li>
                <a href="">
                  <div>
                    <img src="./imgs/10.png" alt="">
                  </div>
                </a>
                <a href="">企业特惠</a>
              </li>
              <li>
                <a href="">
                  <div>
                    <img src="./imgs/10.png" alt="">
                  </div>
                </a>
                <a href="">教育优惠</a>
              </li>
              <li>
                <a href="">
                  <div>
                    <img src="./imgs/10.png" alt="">
                  </div>
                </a>
                <a href="">以旧换新</a>
              </li>      
            </ul>
          </div>
          <div class="bd-right">
            <div class="bd-right-up">
              <span>公告</span>
                <em>荣耀商城-中信银行信用卡分期活动
                </em>
            </div>
            <div  class="bd-right-down">
              <ul class="flex">
                <li>
                  <a href=""class="flex">
                    <div>                 
                    <!-- <img src="./imgs/10.png" alt=""> -->
                  </div><i>优购码</i>
                  </a>
                </li>
                <li>
                  <a href=""class="flex">
                    <div>                 
                    <em></em>
                  </div><i>我的订单</i>
                  </a>
                </li>
                <li>
                  <a href=""class="flex">
                    <div>                 
                    <em></em>
                  </div><i>购物保障</i>
                  </a>
                </li>

              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

<!-- 广告结束 -->
  <div class="cent">
    <div class="mgn">
      <div class="xinpingdiv">
        <ul class="xinping flex">
          <li>
            <img src="./imgs/15.png" alt="">
          </li>
          <li>
            <img src="./imgs/16.png" alt="">
          </li>
          <li>
            <img src="./imgs/17.png" alt="">
          </li>
          <li>
            <img src="./imgs/19.png" alt="">
          </li>
        </ul>
      </div>
      <div class="onlytime">
        <div class="xianshigou">限时购</div>
      </div>
  
      <div class=" xsgdiv"> 
        <ul class="xsg flex">
          <li>
            <div class="xsg-cent">
              <img src="./imgs/20.png" alt="">
              <div>享三年整机质保</div>
              <p>【定金】荣耀智慧屏x2</p>
              <span>暂无报价</span>
            </div>       
          </li>
          <li>
            <div class="xsg-cent">
              <img src="./imgs/21.png" alt="">
              <div>限时直降200元</div>
              <p>荣耀x20 se</p>
              <span>￥1599</span>
            </div>       
          </li>
          <li>
            <div class="xsg-cent">
              <img src="./imgs/22.png" alt="">
              <div>最高优惠三百元</div>
              <p>MagicBook 16</p>
              <span>￥5199</span>
            </div>       
          </li>
          <li>
            <div class="xsg-cent">
              <img src="./imgs/23.png" alt="">
              <div>最高优惠一百元</div>
              <p>荣耀平板V7</p>
              <span>￥1899</span>
            </div>       
          </li>
          <li>
            <div class="xsg-cent">
              <img src="./imgs/24.png" alt="">
              <div>沉浸音质 游戏低时延</div>
              <p>荣耀xSport Por 蓝牙耳机</p>
              <span>￥329</span>
            </div>       
          </li>
        </ul>
      </div>

      <div class="rxdp">
        <span>热销单品</span>
      </div>
      <div class="cent-rxdp"> 
        <div>
          <ul class="cent-rxdp-one">
            <li>
              <img src="./imgs/25.png" alt="">
            </li>
          </ul>
        </div>
        <div class="flex cent-rxdp-twodiv">
          <ul class=" cent-rxdp-two"> 
            <li>
              <img src="./imgs/26.png" alt="">
              <div>荣耀 play50 Pro</div>
              <p>￥1399</p>
            </li>
            <li>
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>￥2700</p>
            </li>
            <li>
              <img src="./imgs/28.png" alt="">
              <div>荣耀 v40轻奢版</div>
              <p>￥3399</p>
            </li>
            <li>
              <img src="./imgs/29.png" alt="">
              <div>荣耀 x20</div>
              <p>￥1699</p>
            </li>
            <li>
              <img src="./imgs/30.png" alt="">
              <div>荣耀x20SE</div>
              <p>￥1599</p>
            </li>
            <li>
              <img src="./imgs/31.png" alt="">
              <div>荣耀 50  se</div>
              <p>￥2399</p>
            </li>
            <li>
              <img src="./imgs/32.png" alt="">
              <div>荣耀 play5</div>
              <p>￥1999</p>
            </li>
            <li>
              <img src="./imgs/33.png" alt="">
              <div>荣耀 40 Pro</div>
              <p>￥2699</p>
            </li>

        
          </ul>
        </div>
      </div>
      
      <div class="jptj">
        <span>精品推荐</span>
      </div>
      <div class=" jptjdiv"> 
        <ul class="jptj flex">
          <li> 
            <div class="jptj-cent">
              <img src="./imgs/精品推荐/1.png" alt="">
              <div>享三年整机质保</div>
              <p>【定金】荣耀智慧屏x2</p>
              <span>暂无报价</span>
            </div>       
          </li>
          <li> 
            <div class="jptj-cent">
              <img src="./imgs/精品推荐/2.png" alt="">
              <div>限时直降200元</div>
              <p>荣耀x20 se</p>
              <span>￥1599</span>
            </div>       
          </li>
          <li>
            <div class="jptj-cent">
              <img src="./imgs/精品推荐/3.png" alt="">
              <div>最高优惠三百元</div>
              <p>MagicBook 16</p>
              <span>￥5199</span>
            </div>       
          </li>
          <li>
            <div class="jptj-cent">
              <img src="./imgs/精品推荐/4.png" alt="">
              <div>最高优惠一百元</div>
              <p>荣耀平板V7</p>
              <span>￥1899</span>
            </div>       
          </li>
          <li>
            <div class="jptj-cent">
              <img src="./imgs/精品推荐/5.png" alt="">
              <div>沉浸音质 游戏低时延</div>
              <p>荣耀xSport Por 蓝牙耳机</p>
              <span>￥329</span>
            </div>       
          </li>
        </ul>
        <div class=" jptjdiv-youjt">
          <em></em>
        </div>
      </div>
    </div>
    <div class="mgn geduan">
      <img src="./imgs/9.png" alt="">
    </div>
    <div class="cent-Lowerhalf mgn">
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p class="floor">手机</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p  class="floor">笔记本电脑</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p  class="floor">精品平板</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p class="floor" >智能穿戴</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p class="floor" >智慧屏</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p class="floor">热销配件</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p class="floor"> 智能家居</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
      <div class="cent-Lowerhalf-shouji"> 
        <div class="cent-Lowerhalf-shouji-nav">
          <p class="floor">荣耀亲选</p>
        <ul class="flex ">
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
          <li>荣耀Magic3系列</li>
        </ul>
        </div>
        <div class="cent-Lowerhalf-shouji-img">
          <ul class="flex">
            <li class="a">
              <img src="./imgs/手机/1.jpg" alt="">
            </li>
            
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
            <li class="b">
              <img src="./imgs/27.png" alt="">
              <div>荣耀 v40</div>
              <p>14亿色视网膜机屏幕</p>
              <h6>￥2700</h6>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </div>
<!-- 尾部 -->
  <div class="bottom">
    <div class="bottom-cent mgn">
      <div class="bottom-cent-head">
        <ul class="flex">
          <li>
            <a href=""><i></i>官方商城 品质保证</a>
          </li>
          <li>
            <a href=""><i></i>官方商城 品质保证</a>
          </li>
          <li>
            <a href=""><i></i>官方商城 品质保证</a>
          </li>
          <li>
            <a href=""><i></i>官方商城 品质保证</a>
          </li>
        </ul>
      </div>

      <div class="bottom-cent-cent">
        <div class="bottom-cent-cent-left ">
          <div class="a">
            <p>推荐产品</p>
            <ul>
              <li>手机</li>
              <li>笔记本</li>
              <li>拼版</li>
              <li>智慧屏</li>
              <li>智能穿戴</li>
              <li>智能家居</li>
              <li>配件</li>
            </ul>
          </div>
          <div class="a">
            <p>推荐产品</p>
            <ul>
              <li>手机</li>
              <li>笔记本</li>
              <li>拼版</li>
              <li>智慧屏</li>
              <li>智能穿戴</li>
              <li>智能家居</li>
              <li>配件</li>
            </ul>
          </div>
          <div class="a">
            <p>推荐产品</p>
            <ul>
              <li>手机</li>
              <li>笔记本</li>
              <li>拼版</li>
              <li>智慧屏</li>
              <li>智能穿戴</li>
              <li>智能家居</li>
              <li>配件</li>
            </ul>
          </div>
          <div class="a">
            <p>推荐产品</p>
            <ul>
              <li>手机</li>
              <li>笔记本</li>
              <li>拼版</li>
              <li>智慧屏</li>
              <li>智能穿戴</li>
              <li>智能家居</li>
              <li>配件</li>
            </ul>
          </div>
          <div class="a">
            <p>推荐产品</p>
            <ul>
              <li>手机</li>
              <li>笔记本</li>
              <li>拼版</li>
              <li>智慧屏</li>
              <li>智能穿戴</li>
              <li>智能家居</li>
              <li>配件</li>
            </ul>
          </div>
          
        </div>
        <div class="bottom-cent-cent-right">
          <p>在线客服</p>
          <h4>400-078-8888</h4>
          <h6>商城服务热线</h6>
          <div>
            <span>关注荣耀：</span>

          </div>
        </div>
      </div>
      <div class="bottom-cent-end ">
        <div class="a">
          <span>隐私声明<i>|</i></span>
          <span>使用条款<i>|</i></span>
          <span>关于cookies</span>
          <i>版权所有 @ 荣耀终端有限公司 2021 保留一切权利</i>
        </div>
        <div class="b">
          <p>粤ICP备20047157 | 粤公安备44444444444号</p>
        </div>
        <div class="c">
          <p>增信电信业务许可证： 粤b2-20201081</p>
        </div>
            
      </div>

      
    </div>

    </div>

    <div class="floor2">
      <div>
        <a href="./shopcar.html">在线客服</a>
      </div>
      <div>
        <a href="./shopcar.html">自动服务</a>
      </div>
      <div>
        <a href="./shopcar.html">返回顶部</a>
      </div>
    </div>
    <div class=" floor-a floor2">
      <div>
        <a href="./shopcar.html">购物车</a>
      </div>
    </div>
    <div class=" floor-b  floor">
      <ul class="btns">
        <li>手机</li>
        <li>笔记本电脑</li>
        <li>精品平板</li>
        <li>智能穿戴</li>
        <li>智慧屏</li>
        <li>热小配件</li>
        <li>智能家居</li>
        <li>荣耀亲选</li>
      </ul>
    </div>


    <script>
      $(".btns").children("li").click(function(){
          $("html").stop().animate({
              scrollTop: $(".floor").eq($(this).index()).offset().top
          })
      })  
      

      console.log(1)
  </script>
</body>
<script src="./js/ajax.js"></script>
<!-- <script src="./js/jquery.js"></script> -->
<script src="./js/index.js"></script>

</html>